Si eliminas esas líneas en negrita estás eliminando los botones, recuerda que si deseas añadirlos posteriormente deberás añadir otra vez lo mismo que estás eliminando :)
Y ya por pedir que no quede... mira que soy pesao, jaja :P
Yo sigo con lo del menú. No sé si recordarás que hace tiempo te comenté que no quería que aquel sencillo menú con css dejase espacios entre las distintas pestañas que lo conforman. No podía juntarlas por el problema de usar el diseñador de plantillas. Más tarde Potro publicó una entrada en la que comentaba este problema: http://ciudadblogger.com/2011/03/como-usar-cualquier-menu-en-las.html Apliqué los cambios que comentaba en la entrada y finalmente las pestañas del menú pudieron juntarse, pero había un problema y era que los estilos que le intentaba dar al menú desde la parte del css no funcionaban. Las letras del menú quedaban muy grandes y en rojo... me podrías ayudar?
:: Fran, en los comentarios he visto que Potro te dio solución a ese problema :D hazle caso porque él debe haber probado lo que dice en las nuevas plantillas, yo me limito siempre o casi siempre a publicar cosas sobre las "no tan nuevas" las nuevas las encuentro más limitadas ;)
:: Fran, veamos :O ve probando y mirando en vista previa ¿ok? Busca: .tabs-inner .widget li a { border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; ...... ...... } El border lo cambiamos a 0 enlas dos líneas anteriores.
Eliminamos toda la línea de background que lleva una imagen y color y el margin-left lo dejamos a 0, con el margin-rigth hacemos lo mismo.
Por último en el menú buscamos
#navigation a { background-color: #000000; border-bottom: 3px solid #000000; y el color blanco de border-bottom lo cambiamos a negro #000000 }
No se si es alterará algo de la plantilla a simple vista parece que no, ahora bien, si deseas centrarlo yo he probado añadiendo un ancho al menú y disminuyendo el margen izquierdo: #navigation { background: #000000; margin-left: 30px; width: 790px; }
Luego en #navigation a cambié el padding:
#navigation a { padding: 10px 19px ... ... }
Este es el resultado: http://img52.xooimage.com/files/5/c/3/13-4-2011-17.4.35-1-27a634b.jpg
No sé si es que soy tremendamente torpe o qué pero no lo he conseguido. Lo que pasa es que mi código no es exactamente igual que el que tú me adjuntas en el comentario. Te pego como me aparece a mí: .tabs-inner .widget li a { display: inline-block;
:: Las plantillas creadas con el diseñador son como retroceder en el tiempo porque se puede conseguir lo mismo sin usar el diseñador. Tendría que instalarme de nuevo tu plantillas pero estos días va a ser imposible porque no dispongo de tiempo, si quieres me la envías de nuevo y más adelante la puedo mirar.
:: Lo solucioné el martes Fran pero no he visto el momento de mandarte el mail porque me puse a buscar tu correo y no lo encontraba :S Mándame uno y te envío de vuelta las indicaciones que debes seguir que son exactamente las que te di en el comentario de días atrás y queda perfecto ;)
:: Veamos te lo paso por aquí porque no veo tu mail no sé que ocurre :S Antes de hacer nada descarga una copia del archivo xml de la plantilla, luego busca en los estilos las siguientes porciones de código y las sustituyes por estas que ya están modificado.
Debes buscar en la plantilla las porciones de código siguientes y sustituirlas por estas que ya está modificado.
.tabs-inner .widget li a { display: inline-block; padding: .6em 1em; font: $(tabs.font); color: $(tabs.text.color); border-$startSide: none; border-$endSide:none; }
#navigation a { background-color:#000000; /* color de fondo */ border-bottom:3px solid #000; /* Línea inferior * color:#FFFFFF; /* Color de texto */ display:inline-block; font-size:15px; /* Tamaño de fuente */ font-weight:normal; margin-right:1px; padding:10px 20px 10px; /* Anchura y altura de las pestañas */ text-decoration:none; text-transform:uppercase; /* Letra mayúscula */ text-shadow:0 1px 1px #CDCDCD ;/* Sombra texto */ }
El menú ha quedado justo como quería. Muchísimas gracias, Julia. Y ahora, para rizar el rizo, ¿cómo podría hacer desaparecer el pequeño espacio que queda entre el menú y la foto de la cabecera?
Siento haberte dado la lata con el menú todo este tiempo :D
:: Prueba eliminando esa línea de border y mira en vista previa: border-top: $(header.border.size) solid $(body.rule.color); Esos problemas vienen por usar el diseñador que cuando hay que modificar algo no se sabe donde está ese algo :S
Ya lo había probado y al eliminar esa línea el borde se hace un poco más estrecho pero sigue apareciendo un pequeño espacio, no se queda el menú completamente pegado a la imagen :S
Bueno, lo he dejado como estaba antes de quitar el borde. Si no puede ser, no puede ser. Al menos ahora no queda tan antiestético y no hay espacios entre las pestañas :D
Gracias de nuevo, Julia. Eres una máquina!! :D
Y otra de mis dudas es cómo podría redimensionar el blog para que se vea con cualquier resolución de pantalla
¡Cómo nos vais facilitanto todo! Cuántas vueltas le he dado para cambiar el fondo, el tamaño, la forma,... para por fin quedarme con el más sencillo.
ResponderEliminarHola, Julia. Te acabo de enviar el código de mi plantilla para que mires la forma de eliminar los botones de compartir de blogger.
ResponderEliminarMuchas gracias :D
:: m.p.moreno personalizar la plantilla engancha ¿verdad? nos damos cuenta que no es tan complicado y vamos más allá :)
ResponderEliminar:: Estupendo Fran, luego la miro ;)
:: Fran marca para expandir la plantilla y busca:
ResponderEliminar<div class='post-footer-line post-footer-line-2'>
Unas líneas más arriba dice:
<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>
Si eliminas esas líneas en negrita estás eliminando los botones, recuerda que si deseas añadirlos posteriormente deberás añadir otra vez lo mismo que estás eliminando :)
Muchísimas gracias, Julia. Ya están quitados. Sin duda, eres la mejor :D
ResponderEliminar¡Un beso grande!
:: Perfecto Fran, era muy sencillo pero a veces a lo más sencillo le damos mil vueltas :)
ResponderEliminarY ya por pedir que no quede... mira que soy pesao, jaja :P
ResponderEliminarYo sigo con lo del menú. No sé si recordarás que hace tiempo te comenté que no quería que aquel sencillo menú con css dejase espacios entre las distintas pestañas que lo conforman. No podía juntarlas por el problema de usar el diseñador de plantillas. Más tarde Potro publicó una entrada en la que comentaba este problema: http://ciudadblogger.com/2011/03/como-usar-cualquier-menu-en-las.html
Apliqué los cambios que comentaba en la entrada y finalmente las pestañas del menú pudieron juntarse, pero había un problema y era que los estilos que le intentaba dar al menú desde la parte del css no funcionaban. Las letras del menú quedaban muy grandes y en rojo... me podrías ayudar?
Gracias.
:: Fran, en los comentarios he visto que Potro te dio solución a ese problema :D hazle caso porque él debe haber probado lo que dice en las nuevas plantillas, yo me limito siempre o casi siempre a publicar cosas sobre las "no tan nuevas" las nuevas las encuentro más limitadas ;)
ResponderEliminarLa respuesta que me dió no funcionó :S
ResponderEliminar:: Fran, veamos :O ve probando y mirando en vista previa ¿ok?
ResponderEliminarBusca:
.tabs-inner .widget li a {
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
......
......
}
El border lo cambiamos a 0 enlas dos líneas anteriores.
Luego busca:
.tabs-inner .widget ul {
background: url("http://www.blogblog.com/1kt/simple/gradients_light.png") repeat-x scroll 0 -800px #F4F4F4;
border-bottom: 1px solid #FFFFFF;
margin-left: -30px;
margin-right: -30px;
margin-top: 0;
}
Eliminamos toda la línea de background que lleva una imagen y color y el margin-left lo dejamos a 0, con el margin-rigth hacemos lo mismo.
Por último en el menú buscamos
#navigation a {
background-color: #000000;
border-bottom: 3px solid #000000;
y el color blanco de border-bottom lo cambiamos a negro #000000
}
No se si es alterará algo de la plantilla a simple vista parece que no, ahora bien, si deseas centrarlo yo he probado añadiendo un ancho al menú y disminuyendo el margen izquierdo:
#navigation {
background: #000000;
margin-left: 30px;
width: 790px;
}
Luego en #navigation a cambié el padding:
#navigation a {
padding: 10px 19px
...
...
}
Este es el resultado:
http://img52.xooimage.com/files/5/c/3/13-4-2011-17.4.35-1-27a634b.jpg
Veamos si tienes suerte :)
No sé si es que soy tremendamente torpe o qué pero no lo he conseguido.
ResponderEliminarLo que pasa es que mi código no es exactamente igual que el que tú me adjuntas en el comentario.
Te pego como me aparece a mí:
.tabs-inner .widget li a {
display: inline-block;
padding: .6em 1em;
font: $(tabs.font);
color: $(tabs.text.color);
border-$startSide: $(tabs.border.width) solid $(content.background.color);
border-$endSide: $(tabs.bevel.border.width) solid $(body.rule.color);
}
.tabs-inner .widget li:first-child a {
border-$startSide: none;
}
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
color: $(tabs.selected.text.color);
background-color: $(tabs.selected.background.color);
text-decoration: none;
}
.tabs-inner .widget ul {
background: $(tabs.background.color) $(tabs.background.gradient) repeat-x scroll 0 -800px;
_background-image: none;
border-bottom: $(tabs.border.width) solid $(body.rule.color);
margin-top: $(tabs.margin.top);
margin-left: -$(tabs.margin.side);
margin-right: -$(tabs.margin.side);
}
Estoy más perdido que un guiri en una reunión de dietética de marujas de pueblo manchego :(
:: Las plantillas creadas con el diseñador son como retroceder en el tiempo porque se puede conseguir lo mismo sin usar el diseñador.
ResponderEliminarTendría que instalarme de nuevo tu plantillas pero estos días va a ser imposible porque no dispongo de tiempo, si quieres me la envías de nuevo y más adelante la puedo mirar.
Muchas gracias, Julia.
ResponderEliminarTe acabo de enviar la plantilla, a ver si das con la forma de manipularla.
:: Ok Fran ;)
ResponderEliminarJulia, ¿cómo vas con lo del menú?
ResponderEliminar:: Lo solucioné el martes Fran pero no he visto el momento de mandarte el mail porque me puse a buscar tu correo y no lo encontraba :S Mándame uno y te envío de vuelta las indicaciones que debes seguir que son exactamente las que te di en el comentario de días atrás y queda perfecto ;)
ResponderEliminarYa lo tienes en tu bandeja de entrada, a ver si esta vez hay suerte. Muchas gracias :)
ResponderEliminar:: Pues no llega Fran, prueba de nuevo :(
ResponderEliminar:: Veamos te lo paso por aquí porque no veo tu mail no sé que ocurre :S
ResponderEliminarAntes de hacer nada descarga una copia del archivo xml de la plantilla, luego busca en los estilos las siguientes porciones de código y las sustituyes por estas que ya están modificado.
Debes buscar en la plantilla las porciones de código siguientes y sustituirlas por estas que ya está modificado.
.tabs-inner .widget li a {
display: inline-block;
padding: .6em 1em;
font: $(tabs.font);
color: $(tabs.text.color);
border-$startSide: none;
border-$endSide:none;
}
.tabs-inner .widget ul {
_background-image: none;
border-bottom: $(tabs.border.width) solid $(body.rule.color);
margin-top: $(tabs.margin.top);
margin-left: 0;
margin-right:0;
}
#navigation a {
background-color:#000000; /* color de fondo */
border-bottom:3px solid #000; /* Línea inferior *
color:#FFFFFF; /* Color de texto */
display:inline-block;
font-size:15px; /* Tamaño de fuente */
font-weight:normal;
margin-right:1px;
padding:10px 20px 10px; /* Anchura y altura de las pestañas */
text-decoration:none;
text-transform:uppercase; /* Letra mayúscula */
text-shadow:0 1px 1px #CDCDCD ;/* Sombra texto */
}
#navigation {
margin-left:21px; /* Margen izquierdo */
top:25px; /* Margen superior */
background:#000000;
margin-left: 30px;
width: 790px;
}
Suerte!!
El menú ha quedado justo como quería. Muchísimas gracias, Julia. Y ahora, para rizar el rizo, ¿cómo podría hacer desaparecer el pequeño espacio que queda entre el menú y la foto de la cabecera?
ResponderEliminarSiento haberte dado la lata con el menú todo este tiempo :D
:: Eso qu eves de separación es un borde, lo puedes eliminar en:
ResponderEliminar.tabs-inner .section:first-child ul {
margin-top: -1px;
border-top: 1px solid #ffffff;
}
suprimiendo la línea de border-top: 1px solid #ffffff; o cambiando el borde a 0px :)
(No me diste la lata lo que ocurre que esa plantilla lleva mucho código confuso pero quedó como a ti te gusta y eso es lo que cuenta)
Otra vez hay problemas con eso. Esto es lo que me aparece a mí:
ResponderEliminar.tabs-inner .section:first-child ul {
margin-top: -$(header.border.size);
border-top: $(header.border.size) solid $(body.rule.color);
}
:: Prueba eliminando esa línea de border y mira en vista previa:
ResponderEliminarborder-top: $(header.border.size) solid $(body.rule.color);
Esos problemas vienen por usar el diseñador que cuando hay que modificar algo no se sabe donde está ese algo :S
Ya lo había probado y al eliminar esa línea el borde se hace un poco más estrecho pero sigue apareciendo un pequeño espacio, no se queda el menú completamente pegado a la imagen :S
ResponderEliminarUna vez eliminas el borde puedes subirlo en:
ResponderEliminar#navigation ul {
list-style: none outside none;
margin: -5px 0;
padding: 0;
}
En Firefox se ve perfectamente, pero en Explorer se ve faltal. ¿Puedes mirarlo y ayudarme a solucionarlo?
ResponderEliminarGracias.
:: Si que es verdad Fran pero no sabría decirte como arreglarlo :(
ResponderEliminarBueno, lo he dejado como estaba antes de quitar el borde. Si no puede ser, no puede ser. Al menos ahora no queda tan antiestético y no hay espacios entre las pestañas :D
ResponderEliminarGracias de nuevo, Julia. Eres una máquina!! :D
Y otra de mis dudas es cómo podría redimensionar el blog para que se vea con cualquier resolución de pantalla
:: Eso se establece en la plantilla Fran, pero como te decía anteriormente las del diseñador son muy confusas :S
ResponderEliminar